<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文件系统</title>
    <script src="../js/jQuery%203.4.1%20produce.js"></script>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/bootstrap-grid.css">

    <script>

        var totalPage = 0;
        var branch;
        var stage;
        var page;
        var profession;
        var classNum;

        var fileSet = new Set();

        var downloadFilepath;
        var downloadFiletype;

        function getTarget(){
            //获取党支部
            branch = getSelected($("#branch option"));
            //获取发展阶段
            stage = getSelected($("#stage option"));
            //获取页数
            //默认为1
            //page = 1;
            //获取专业
            profession = getSelected($("#profession option"));
            //获取班级号
            classNum = getSelected($("#classNum option"));
        }


        $(function () {

            //分别给换页按钮绑定事件
            $("#previous").click(function () {
                page = parseInt($("#currentPage").val());
                if (page === 1){
                    alert("当前已经是第一页");
                }else {
                    getTarget();
                    $.get(
                        "../info/get_members_info",
                        {
                            "branch": branch,
                            "stage": stage,
                            "page": page-1,
                            "profession": profession,
                            "classNum": classNum
                        },
                        function (data) {
                            showData(data.data.result);
                            checkBoxRecheck();
                        },
                        "json"
                    );
                    page -= 1;
                    $("#currentPage").val(page);
                }
            });

            $("#next").click(function () {
                page = parseInt($("#currentPage").val());
                if (page >= totalPage){
                    alert("当前已经是最后一页");
                }else {
                    //发送第二页的请求
                    getTarget();
                    $.get(
                        "../info/get_members_info",
                        {
                            "branch": branch,
                            "stage": stage,
                            "page": page+1,
                            "profession": profession,
                            "classNum": classNum
                        },
                        function (data) {
                            showData(data.data.result);
                            checkBoxRecheck();
                        },
                        "json"
                    );
                    page += 1;
                    $("#currentPage").val(page);
                }
            });

            /**
             * 对下拉框有选择新数据的行为，展示相应专业所包含的班级
             */
            $("#profession").change(function () {
                $("#classNum").empty();
                //如果选择的是请选择按钮，则不进行班级搜索
                var target = getSelected($("#profession option"));
                if (target === ""){
                    var str = "<option arrt=\"\">请选择</option>";
                    $("#classNum").append(str);
                    return ;
                }
                $.get(
                    "../info/classNum",
                    {
                        "profession": target
                    },
                    function (data) {
                        var classList = data.data;
                        var classSelect = $("#classNum");
                        var str = "<option arrt=\"\">请选择</option>";
                        classSelect.append(str);
                        for (let i = 0; i < classList.length; i++) {
                            var str = "<option arrt=\""+classList[i]+"\">"+classList[i]+"</option>";
                            classSelect.append(str);
                        }
                    },
                    "json"
                )
            });


            /**
             * 绑定查询按钮的点击时间
             * 负责获取下拉框的值并发出请求获取数据
             */
            $("#submit").click(function () {

                getTarget();
                page = 1;
                $.get(
                    "../info/get_members_info",
                    {
                        "branch": branch,
                        "stage": stage,
                        "page": page,
                        "profession": profession,
                        "classNum": classNum
                    },
                    function (data) {
                        showData(data.data.result);
                        $("#currentPage").val(page);
                        totalPage = parseInt(data.data.totalPage);
                        $("#totalPage").html("/"+totalPage+"页")

                    },
                    "json"
                )

            });

            /**
             * 关于党支部的级联操作
             */
            $("#branch").change(function () {
                $("#profession").empty();
                //如果选择的是请选择按钮，则不进行班级搜索
                var target = getSelected($("#branch option"));
                if (target === ""){
                    var str = "<option value=\"\">请选择</option>";
                    $("#profession").append(str);
                    return ;
                }
                $.get(
                    "../info/profession",
                    {
                        "branch": target
                    },
                    function (data) {
                        var professionList = data.data;
                        var professionSelect = $("#profession");
                        var str = "<option value=\"\">请选择</option>";
                        professionSelect.append(str);
                        for (let i = 0; i < professionList.length; i++) {
                            var str = "<option value=\""+professionList[i]+"\">"+professionList[i]+"</option>";
                            professionSelect.append(str);
                        }
                    },
                    "json"
                )
            });

            //绑定文件生成按钮事件
            $("#generate").click(function () {
                var fileType = getSelected($("#fileType option"));
                var studentNums = "";
                if (fileSet.size === 0){
                    return ;
                }
                for(let x of fileSet){
                    studentNums += x+",";
                }

                $.get(
                    "../file/"+fileType,
                    {
                        "student_nums": studentNums
                    },
                    function (data) {
                        if (data.status === 1){
                            $("#returnMessage").html(data.message);
                            //设置按钮可选状态
                            $("#downloadFile").removeAttr("disabled");
                            //给路径赋值
                            downloadFiletype = data.data.filetype;
                            downloadFilepath = data.data.filepath;
                            //成功执行后，清除选中状态
                            fileSet.clear();
                            checkBoxRecheck();
                        }

                    },
                    "json"
                )
            });

            /**
             * 绑定下载事件
             */
            $("#downloadFile").click(function () {
                window.location.href = "../file/download?filepath=" + downloadFilepath + "&filetype=" + downloadFiletype;
                $("#downloadFile").attr("disabled", "disabled");
            });


            $("#clearChecked").click(function () {
                fileSet.clear();
                checkBoxRecheck();
            });


        });



        //展示数据
        function showData(data) {
            var obj_list = data;
            var body = $("#resultShow");
            $(body).empty();
            for (var i = 0; i < obj_list.length; i++){
                var student = obj_list[i];
                var result = "<tr><td><input type='checkbox' class='check' onclick='checkBoxFunction(this)' value='"+student.num
                    +"'></td><td><a href=\"../page/personalPage/"+
                    student.num+"\">"+student.num +"</a></td><td>"+student.name
                    +"</td><td>"+student.birth+"</td><td>"+student.telephone+"</td><td>"+student.stage+"</td>" +
                    "<td>"+student.classNum+"</td>"+"</tr>";
                $(body).append(result);
            }
        }

        function getSelected(array) {
            for (var i = 0; i < array.length; i++) {
                if (array[i].selected === true){
                    return array[i].getAttribute("value");
                }
            }
        }

        //翻页后复选框重新选择事件
        function checkBoxRecheck() {
            var checkboxes = $(".check");
            for (let i = 0; i < checkboxes.length; i++) {
                if (fileSet.has(checkboxes[i].value)){
                    checkboxes[i].checked = true;
                }else {
                    checkboxes[i].checked = false;
                }

            }
        }

        //绑定复选框点击事件
        function checkBoxFunction(object) {
            if (object.checked === true){
                fileSet.add(object.value);
            }else{
                fileSet.delete(object.value);
            }
        }

    </script>


</head>
<body>

<div class="container">
    <div class="jumbotron">
        <h2>你好党建人！</h2>
        <p>欢迎来到文件系统<br>
            祝你工作顺利</p>
        <form class="form-inline">
            <div class="form-group">
                <label for="branch">党支部：</label>
                <select id="branch" class="form-control">
                    <option value="">请选择</option>
                    <option value="学生第一党支部">学生第一党支部</option>
                    <option value="学生第二党支部">学生第二党支部</option>
                    <option value="学生第三党支部">学生第三党支部</option>
                </select>

                <label for="stage">发展阶段：</label>
                <select id="stage" class="form-control">
                    <option value="Applicant">入党申请人</option>
                    <option value="Activist">积极分子</option>
                    <option value="Inspector">考察对象</option>
                    <option value="Developer">发展对象</option>
                    <option value="PartyMember">党员</option>
                </select>

                <label for="profession">专业：</label>
                <select id="profession" class="form-control">
                    <option value="">请选择</option>
                    <option value="计算机科学与技术">计算机科学与技术</option>
                    <option value="大数据与数据科学">大数据与数据科学</option>
                    <option value="信息管理与信息系统">信息管理与信息系统</option>
                    <option value="互联网金融">互联网金融</option>
                    <option value="软件工程">软件工程</option>
                    <option value="电子商务">电子商务</option>
                </select>

                <label for="classNum">班级：</label>
                <select id="classNum" class="form-control">
                    <option value="">请选择</option>
                </select>
            </div>
            <button type="button" id="submit" class="btn btn-default">查询</button>
            <button type="button" class="btn btn-info" onclick="window.location='../page/index'">返回主页</button>
        </form>
        <form class="form-inline" style="padding-bottom: 30px; padding-top: 20px">
            <div class="form-group">
                <label for="fileType">生成文件类型：</label>
                <select id="fileType" class="form-control">
                    <option value="signin">签到表</option>
                    <option value="inspectorReport">考察报告</option>
                    <option value="politicalSituation">政审报告</option>
                    <option value="activistRecord">积极分子备案表</option>
                    <option value="developerRecord">发展对象备案表</option>
                    <option value="partyMemberRecord">预备党员备案表</option>
                    <option value="firstPublicity">第一榜公示</option>
                    <option value="secondPublicity">第二榜公示</option>
                    <option value="thirdPublicity">第三榜公示</option>
                    <option value="fourthPublicity">第四榜公示</option>
                    <option value="fifthPublicity">第五榜公示</option>
                </select>
            </div>
            <button type="button" id="generate" class="btn btn-default">生成</button>
            <button type="button" id="clearChecked" class="btn btn-warning">清空选中</button>

        </form>

        <div>
            <p id="returnMessage" style="font-size: 15px"></p><br>
            <button type="button" class="btn btn-lg btn-primary" disabled="disabled" id="downloadFile">下载文件</button>
        </div>
    </div>

    <table class="table table-bordered table-striped">
        <thead>
        <tr>
            <th></th>
            <th>学号</th>
            <th>姓名</th>
            <th>生日</th>
            <th>联系方式</th>
            <th style="width: 300px;">发展阶段</th>
            <th>班级</th>
        </tr>
        </thead>
        <tbody id="resultShow">

        </tbody>
    </table>
    <form class="form-inline switchpages">
        <button type="button" id="previous" class="btn btn-default">上一页</button>
        <div class="form-group">
            <input type="text" class="form-control pages" width="50px" id="currentPage" placeholder="0" readonly>
            <label id="totalPage">/页</label>
        </div>
        <button type="button" id="next" class="btn btn-default">下一页</button>
    </form>
</div>
<div class="container" style="height: 30px">

</div>

</body>
</html></html>